<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>员工管理</title>
    <link rel="stylesheet" href="../../bootstrap-3.4.1-dist/css/bootstrap.min.css" />
    <link rel="stylesheet" href="../../css/A3.css" />
    <!-- 请在A3.css后面插入私有部分css，注意相对路径改变-->
</head>

<!-- 
    问题1：锁定按钮的功能还没实现  功能：点击锁定，会将该条数据的修改和删除按钮不可用，锁定二字变为已锁定，点击已锁定解锁，修改和删除按钮恢复原样
    问题2：搜索员工的功能还没实现  功能：输入员工的工号，点击搜索按钮，下边显示相对应的员工工号的数据
    目标实现：对员工数据的增删改查
    查看选项卡内容：对员工的修改、锁定和删除，页码
    添加选项卡：填写员工的信息，点击确认添加，将该名员工添加到查看选项卡表格的最后一条
    搜索选项卡：搜索员工，显示员工信息
 -->


<!-- 修改和添加的模态框模态框 -->
<!-- 为什么这种模态框是写在head和body标签之间？ -->
<!-- 模态框--修改用户 -->
<div id="alterUser" class="modal fade" onclick="" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="exampleModalLabel">信息修改</h4>
            </div>

            <div class="modal-body">
                <!--模态框--修改--表单内容-->
                <form>
                    <div class="form-group">
                        <label for="stuNumber" class="control-label">工号:</label>
                        <input type="text" class="form-control" id="stuNumber">
                    </div>
                    <div class="form-group">
                        <label for="stuName" class="control-label">姓名:</label>
                        <input type="text" class="form-control" id="stuName">
                    </div>
                    <div class="form-group">
                        <label for="stuIdCard" class="control-label">身份证:</label>
                        <input type="text" class="form-control" id="stuIdCard">
                    </div>
                    <div class="form-group">
                        <label for="stuRFID" class="control-label">RFID卡号:</label>
                        <input type="text" class="form-control" id="stuRFID">
                    </div>
                    <div class="form-group">
                        <label for="stuPhone" class="control-label">联系电话:</label>
                        <input type="text" class="form-control" id="stuPhone">
                    </div>
                    <div class="form-group">
                        <label for="stuZhuangtai" class="control-label">在职状态:</label>
                        <input type="text" class="form-control" id="stuZhuangtai">
                    </div>
                    <div class="form-group">
                        <label for="stuGrade" class="control-label">操作等级:</label>
                        <input type="text" class="form-control" id="stuGrade">
                    </div>
                </form>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" onclick="changeStu()">确认修改</button>
            </div>

        </div>
    </div>
</div>

<!-- 模态框--添加用户 -->
<div id="addUser" class="modal fade" onclick="" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                        aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="exampleModalLabel">添加员工</h4>
            </div>
            <div class="modal-body">
                <!--模态框--添加结构 -->
                <form>
                    <div class="form-group">
                        <label for="stuNumber" class="control-label">工号:</label>
                        <input type="text" class="form-control" id="addStuNumber">
                    </div>
                    <div class="form-group">
                        <label for="stuName" class="control-label">姓名:</label>
                        <input type="text" class="form-control" id="addStuName">
                    </div>
                    <div class="form-group">
                        <label for="stuIdCard" class="control-label">身份证:</label>
                        <input type="text" class="form-control" id="addStuIdCard">
                    </div>
                    <div class="form-group">
                        <label for="stuRFID" class="control-label">RFID卡号:</label>
                        <input type="text" class="form-control" id="addStuRFID">
                    </div>
                    <div class="form-group">
                        <label for="stuPhone" class="control-label">联系电话:</label>
                        <input type="text" class="form-control" id="addStuPhone">
                    </div>
                    <div class="form-group">
                        <label for="stuZhuangtai" class="control-label">在职状态:</label>
                        <input type="text" class="form-control" id="addStuZhuangtai">
                    </div>
                    <div class="form-group">
                        <label for="stuGrade" class="control-label">操作等级:</label>
                        <input type="text" class="form-control" id="addStuGrade">
                    </div>
                </form>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary" onclick="addStudent()">确认添加</button>
            </div>
        </div>
    </div>
</div>

<body>
    <script src="../../bootstrap-3.4.1-dist/js/jquery-3.4.1.min.js"></script>
    <script src="../../bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
    <!-- 公共部分头部 -->
    <header id="gonggong_header">
        <div id="gonggong_user">
            <div>
                <a href=""><i class="glyphicon glyphicon-user"></i></a>
            </div>
            <div id="gonggong_username">
                <p>姓名: <span>李黑帅</span></p>
                <p>工号: <span>913733</span></p>
            </div>
        </div>
        <div id="login_out">
            <p>退出</p>
        </div>
    </header>
    <!-- 公共部分尾部 -->
    <div id="gonggong_content">
        <!-- 公共部分侧边栏 -->
        <div id="gonggong_left">
            <!--侧边栏的路径设置-->
            <ul class="nav nav-tabs nav-stacked navbar-inverse">
                <li class="CeBian"></li>
                <!-- 公共部分图片位置，注意相对路径 -->
                <li class="CeBian"><a href="../index/index.html"><img src="../../images/CeBian-YGGL.png">员工管理</a></li>
                <li class="CeBian"><a href="../gonggong/商品管理整合.html"><img src="../../images/CeBian-SPGL.png">商品管理</a></li>
                <li class="CeBian"><a href="../gonggong/销售管理整合.html"><img src="../../images/CeBian-XSGL.png">销售管理</a></li>
                <li class="CeBian"><a href="../cuxiao/cuxiao.html"><img src="../../images/CeBian-CXHD.png">促销活动</a></li>
                <li class="CeBian"><a href="../shanghuo+shouyin/shanghuo1.html"><img src="../../images/CeBian-SH.png">上货</a></li>
                <li class="CeBian"><a href="../shanghuo+shouyin/shouyin1.html"><img src="../../images/CeBian-SY.png">收银</a></li>
            </ul>
        </div>
        <!-- 公共部分右边块 -->
        <div id="gonggong_right">
            <!-- 私有部分放置处 -->
            <div id="gonggong_siyou">
                <div id="yuangong_center_right" class="">
                    <div class="head">
                        <div class="head_imgtext">
                            <p>
                                <span class="glyphicon glyphicon-th-large" id="cx_tp"></span>
                                <span>员工管理</span>
                            </p>
                        </div>
                        <hr>

                        <!--选项卡-->
                        <ul id="myTab" class="nav nav-tabs">
                            <li class="active"><a href="#zfbt" data-toggle="tab">查看员工</a></li>
                            <li><button type="button" class="btn btn-primary" onclick="zuhe()" style="color: #555;
                                               cursor: default;
                                               background-color: #fff;
                                               border: 0;
                                               width: 88px;
                                               height: 41px;
                                               border-bottom-color: transparent;" data-toggle="modal"
                                    data-target="#addUser" data-whatever="@mdo">
                                    <a href="#cjbt" data-toggle="tab">添加员工</a>
                                </button>
                            </li>
                            <li><a href="#pvbt" data-toggle="tab">搜索员工</a></li>
                        </ul>
                        <hr>
                        <div id="myTabContent" class="tab-content" style="margin-top: 20px;">
                            <div class="tab-pane fade in active" id="zfbt">
                                <!--查看员工静态页面-->
                                <div id="zf" style="width: 1503.39px;height:400px;">
                                    <!--表格-->
                                    <div id="table" class="">
                                        <table id="tab" class="table table-striped">
                                            <!--表头 -->
                                            <thead>
                                                <tr>
                                                    <th>工号</th>
                                                    <th>姓名</th>
                                                    <th>身份证</th>
                                                    <th>RFID卡号</th>
                                                    <th>联系电话</th>
                                                    <th>在职状态</th>
                                                    <th>操作等级</th>
                                                    <th>操作</th>
                                                </tr>
                                            </thead>
                                            <!--主体 -->
                                            <tbody id="studentTable">
                                                <!-- 这个表格结构由渲染得到，所以不需要在这里写表格结构 -->
                                            </tbody>
                                        </table>

                                        <!--页码-->
                                        <div id="yuangong_fanye" class="">
                                            <div id="gonggong_fanye" class="">
                                                <nav aria-label="Page navigation">
                                                    <ul class="pagination">
                                                        <!-- 上一页 -->
                                                        <li id="prev" onclick="prevPage()">
                                                            <a href="#" aria-label="Previous">
                                                                <span aria-hidden="true">&laquo;</span>
                                                            </a>
                                                        </li>

                                                        <!-- 下一页 -->
                                                        <li id="next" onclick="nextPage()">
                                                            <a href="#" aria-label="Next">
                                                                <span aria-hidden="true">&raquo;</span>
                                                            </a>
                                                        </li>
                                                    </ul>
                                                </nav>
                                            </div>
                                        </div>

                                    </div>
                                </div>
                            </div>

                            <!--添加员工静态页面-->
                            <div class="tab-pane fade" id="cjbt">
                                <div id="cj" class="float_left" style="width: 1503.39px;height:400px;">
                                    <!-- <form id="addyuangong" class="form-inline">


                                            <div id="addyuangong_text">

                                                <div id="addyuangong_text_left" class=".czpl">
                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*RFID卡号</label>
                                                        <input type="text" class="form-control" id="exampleInputName2"
                                                            placeholder="请输入内容">
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*员工姓名</label>
                                                        <input type="text" class="form-control" id="exampleInputEmail2"
                                                            placeholder="请输入内容">
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*密码</label>
                                                        <input type="text" class="form-control" id="exampleInputName2"
                                                            placeholder="请输入内容">
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*工号</label>
                                                        <input type="text" class="form-control" id="exampleInputName2"
                                                            placeholder="请输入内容">
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*身份证</label>
                                                        <input type="text" class="form-control" id="exampleInputName2"
                                                            placeholder="请输入内容">
                                                    </div>
                                                </div>

                                                <div id="addyuangong_text_right" class=".czpl">
                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*出生日期</label>
                                                        <input type="text" class="form-control" id="exampleInputName2"
                                                            placeholder="请输入内容">
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*入职日期</label>
                                                        <input type="text" class="form-control" id="exampleInputName2"
                                                            placeholder="请输入内容">
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*在职状态</label>
                                                        <select>
                                                            <option>待业</option>
                                                            <option>在岗</option>
                                                            <option>离职</option>
                                                            <option>退休</option>
                                                        </select>
                                                    </div>

                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*操作等级</label>
                                                        <select>
                                                            <option>1</option>
                                                            <option>2</option>
                                                            <option>3</option>
                                                        </select>
                                                    </div>
                                                    <div class="form-group">
                                                        <label for="exampleInputName2">*上传照片</label>

                                                    </div>
                                                </div>


                                            </div>


                                        </form>
                                        <button type="submit" class="btn btn-default">确认添加</button> -->
                                </div>
                            </div>

                            <!--搜索员工静态页面-->
                            <div class="tab-pane fade" id="pvbt">
                                <div id="pv" style="width: 1503.39;height:400px;">

                                    <div id="sousuo">
                                        <div class="input-group">
                                            <input type="text" class="form-control" placeholder="请输入员工工号"
                                                aria-describedby="basic-addon2">
                                            <span onclick="hideTab()" class="input-group-addon" id="basic-addon2"><i class="glyphicon glyphicon-search"></i></span>
                                        </div>
                                    </div>
                                    <table id="yincang_biaoge" style="display: block;">
                                        <thead>
                                            <tr>
                                                <td>工号</td>
                                                <td>姓名</td>
                                                <td>身份证</td>
                                                <td>RFID卡号</td>
                                                <td>联系电话</td>
                                                <td>在职状态</td>
                                                <td>操作等级</td>
                                                <td>操作</td>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>1001</td>
                                                <td>张三</td>
                                                <td>523233197809091234</td>
                                                <td>ASDKFSFSDKFJ0EE3KD</td>
                                                <td>13258231798</td>
                                                <td>在职</td>
                                                <td>1</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>



    <!-- 数据渲染开头 -->
    <!-- 步骤
    1.
    -->
    <!-- document.getElementById('yincang_biaoge').style.display = "none" //隐藏
        // document.getElementById('myVideo').style.display = "block" //显示 -->
    <script>
        //模拟的json数据源
        var student = [/*number:工号,name,idCard:身份证号,RFID,phone,zhuangtai:操作状态,grade:操作等级*/
            { number: '1001', name: '张三', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1002', name: '李四', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '2' },
            { number: '1003', name: '王五', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1004', name: '赵二', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '退休', grade: '3' },
            { number: '1005', name: '刘六', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1006', name: '李狗蛋', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '2' },
            { number: '1007', name: '张嘎子', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '3' },
            { number: '1008', name: '李泉蛋', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '离职', grade: '1' },
            { number: '1009', name: '周吴', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1010', name: '冯伟', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '退休', grade: '3' },
            { number: '1011', name: '苏芳华', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1012', name: '蒋正', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1013', name: '孔三斤', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1014', name: '一娃子', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '离职', grade: '2' },
            { number: '1015', name: '二娃子', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1016', name: '三娃子', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '2' },
            { number: '1017', name: '四娃子', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1018', name: '五娃子', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '退休', grade: '3' },
            { number: '1019', name: '六娃子', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1020', name: '七娃子', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1021', name: '擎天', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1022', name: '曹孔儿', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '1' },
            { number: '1023', name: '伟东西', idcard: '523233197809091234', rfid: 'ASDKFSFSDKFJ0EE3KD', phone: '13258231798', zhuangtai: '在职', grade: '2' },
        ]
        var maxPage = 0 //最大的页码数
        var dangqianyeNum = 1//当前所点击的页码
        var jintong = 1

        //执行的函数
        showYema()//执行函数渲染页码
        showTable(dangqianyeNum)//执行函数


        //表格
        function showTable(dangqianye) {//用来渲染页面
            //let data = student数组的截取(根据当前页来截取的)
            let qishi = (dangqianye - 1) * 3  //表格的起始条数
            let data = student.slice(qishi, qishi + 3)  //表格的结束条数
            $('#studentTable').html('') //清空
            for (var i = 0; i < data.length; i++) {//渲染表结构
                $('#studentTable').append(`
                <tr>
                    <td>${data[i].number}</td>
                    <td>${data[i].name}</td>
                    <td>${data[i].idcard}</td>
                    <td>${data[i].rfid}</td>
                    <td>${data[i].phone}</td>
                    <td>${data[i].zhuangtai}</td>
                    <td>${data[i].grade}</td>
                    <td>
                        <button id="button1" type="button" class="btn btn-danger" data-toggle="modal" data-target="#alterUser" 
                        data-number="${data[i].number}" 
                        data-name="${data[i].name}"
                        data-idcard="${data[i].idcard}"
                        data-rfid="${data[i].rfid}"
                        data-phone="${data[i].phone}"
                        data-zhuangtai="${data[i].zhuangtai}"
                        data-grade="${data[i].grade}"
                        >修改</button>
                        <button id="button2" onclick="suoding()" type="button" class="btn btn-success" data-toggle="modal" data-target="#exampleModal">锁定</button>
                        <button id="button3" onclick="delRow(${data[i].number})" type="button" class="btn btn-warning" data-toggle="modal" data-target="#exampleModal">删除</button>
                    </td>
                </tr>
                `)
            }
            $('.pages').eq(dangqianye - 1).addClass('active').siblings().removeClass('active')
        }


        //页码
        function showYema() {//动态显示翻页页码
            $('.pages').remove()
            maxPage = Math.ceil(student.length / 3)
            for (var i = 1; i <= maxPage; i++) {
                $('#next').before(`
            <li class="pages" onclick="changeYema(this)"><a href="#">${i}</a></li>
            `)
            }
            $('.pages').eq(dangqianyeNum - 1).addClass('active').siblings().removeClass('active')
        }
        function changeYema(obj) {//点击页码，改变表格信息
            //这里我想做什么？  把对面也数据渲染到对应的表格里边
            //根据分析  showTbale(dangqianyeNum) 我如何知道点了第几页
            // console.log(
            console.log($(obj).children().text())  //测试
            console.log($(obj).children().text())
            dangqianyeNum = parseInt($(obj).children().text())
            showTable(dangqianyeNum)
        }
        function prevPage() {//上一页
            if (dangqianyeNum > 1) {
                dangqianyeNum = dangqianyeNum - 1
                showTable(dangqianyeNum)
            }
        }
        function nextPage() {//下一页
            if (dangqianyeNum < maxPage) {
                dangqianyeNum = dangqianyeNum + 1
                showTable(dangqianyeNum)
            }
        }


        //修改按钮
        function changeStu() {//修改表单内容，并保存修改渲染到表格里边
            //1.获取表单里边的值
            var number = $('#stuNumber').val()//获取
            var name = $('#stuName').val()
            var idcard = $('#stuIdCard').val()
            var rfid = $('#stuRFID').val()
            var phone = $('#stuPhone').val()
            var zhuangtai = $('#stuZhuangtai').val()
            var grade = $('#stuGrade').val()
            // console.log(number,name,idcard,rfid,phone,zhuangtai,grade)测试是否拿到上述的值
            //把上述的值装进下边
            var newStu = {
                number: number,
                name: name,
                idcard: idcard,
                rfid: rfid,
                phone: phone,
                zhuangtai: zhuangtai,
                grade: grade
            }
            //2.根据修改的内容，修改数据源
            for (var i = 0; i < student.length; i++)
                if (number == student[i].number) {
                    student.splice(i, 1, newStu)
                }
            //3.点击确认修改，关闭模态框
            $('#alterUser').modal('hide')
            //4.重新渲染表格当前页，运行表格渲染那个函数
            showTable(dangqianyeNum)
        }

        //点击修改按钮时，把点击的当前行的数据分别显示在模态框对应的位置
        $('#alterUser').on('show.bs.modal', function (event) {
            //在这个函数里边将这行数据渲染在表单元素里面
            var button = $(event.relatedTarget)
            var number = button.data('number')
            var name = button.data('name')
            var idcard = button.data('idcard')
            var rfid = button.data('rfid')
            var phone = button.data('phone')
            var zhuangtai = button.data('zhuangtai')
            var grade = button.data('grade')
            //做到现在已经知道如何修改input的值
            var modal = $(this)
            modal.find('.modal-body #stuNumber').val(number)
            modal.find('.modal-body #stuName').val(name)
            modal.find('.modal-body #stuIdCard').val(idcard)
            modal.find('.modal-body #stuRFID').val(rfid)
            modal.find('.modal-body #stuPhone').val(phone)
            modal.find('.modal-body #stuZhuangtai').val(zhuangtai)
            modal.find('.modal-body #stuGrade').val(grade)
        })


        //添加员工
        function addStudent() {//选项卡--添加员工
            var number = $('#addStuNumber').val()
            var name = $('#addStuName').val()
            var idcard = $('#addStuIdCard').val()
            var rfid = $('#addStuRFID').val()
            var phone = $('#addStuPhone').val()
            var zhuangtai = $('#addStuZhuangtai').val()
            var grade = $('#addStuGrade').val()
            var newStu = {
                number: number,
                name: name,
                idcard: idcard,
                rfid: rfid,
                phone: phone,
                zhuangtai: zhuangtai,
                grade: grade
            }
            student.push(newStu)//好像是把添加的数据增加在student数组的后边
            $('#addUser').modal('hide')//点击确认添加时，关闭模态框
            showTable(dangqianyeNum)//重新渲染当前页的数据
            showYema()//增加了数据，页码也可能会增加，所以也需要重新渲染一次页码
        }
        function zuhe() {//点击添加员工时，显示工号的地方会自动添加工号，把表单上次添加的数据清除
            // $('#cjbt').click()
            // var xiabiao = student.slice(-1)
            $('#addStuNumber').val(parseInt(student.slice(-1)[0].number) + 1)
            $('#addStuName').val('')
            $('#addStuIdCard').val('')
            $('#addStuRFID').val('')
            $('#addStuPhone').val('')
            $('#addStuZhuangtai').val('')
            $('#addStuGrade').val('')
        }


        //删除按钮
        function delRow(number) {//删除按钮
            //1.要删除数据  通过number（工号）去找到这个数据
            //2.删除dom节点(tr这个标签里边的所有东西)
            console.log(number)
            for (var i = 0; i < student.length; i++) {
                if (student[i].number == number) {//判断数组里的工号是否等于我点击删除的工号
                    student.splice(i, 1)//上述条件成立，则删除
                }//删除完过后界面还没刷新，需要重新渲染一次表格
                showTable(dangqianyeNum)
                showYema()
            }
        }


        //锁定按钮
        function suoding() {
            if (jintong == 1) {
                $('#button1').attr("disabled", "true")//修改按钮变成禁用
                jintong = 0
            }
            if (jintong == 0) {
                $('#button1').removeAttr("disabled")
                jintong = 1
            }
        }


        //搜索员工 
        //输入员工号，点击搜索系统会去找与之相匹配的员工工号，然后显示在下边的表格中

        var isHide = false;//用来判断显示隐藏的变量
        function hideTab() {
            var tab = document.getElementById('yincang_biaoge')
            var rows = tab.rows; 
            var len = tab.rows.length;
            // tab.style.display=''; 
            for (var i = 1; i < len; i++) {
                if (isHide) {
                    rows[i].style.display = '';
                } else {
                    rows[i].style.display = 'none';
                }
            }
            isHide = !isHide
        }

    </script>
    <!-- 数据渲染结尾 -->

</body>

</html>